<template>
    <div>
        <ul>
            <li v-for="(value,index) of message" :key="index">
                {{value.name}}
                单价：{{value.dj}}
                <Counter :num="value.num" :index="index" @add="add" @sub="sub"></Counter>
            </li>
        </ul>
        <p>总价为：{{numbers}}</p>
    </div>
</template>
<script>
import Counter from"../components/Counter";
import store from "../store.js"
    export default {
        components:{
            Counter
        },
        data(){
            return{
                numbers:store.state.number,
                message:store.state.message
            }
        },
        methods: {
        add(index){
            this.message[index].num++;
            this.numbers=((this.numbers)*10+(this.message[index].dj)*10)/10;
        },
        sub(index){
            if(this.message[index].num>0)
            {
                this.message[index].num--;
                this.numbers=((this.numbers)*10-(this.message[index].dj)*10)/10;
            }
        }
    }
}
</script>